import { DefaultFooter } from '@ant-design/pro-components';
import '@umijs/max';
import React, { useEffect, useState } from 'react';

const Footer: React.FC = () => {
  const defaultMessage = 'Dynabook Inc.All Rights Reserved.';
  const currentYear = new Date().getFullYear();
  const [position, setPosition] = useState<'fixed' | 'static'>('fixed');

  useEffect(() => {
    const handleScroll = () => {
      if (window.innerHeight < document.body.scrollHeight) {
        setPosition('static');
      } else {
        setPosition('fixed');
      }
    };

    const handleVisibilityChange = () => {
      if (document.visibilityState === 'visible') {
        handleScroll();
      }
    };

    window.addEventListener('scroll', handleScroll);
    window.addEventListener('resize', handleScroll);
    document.addEventListener('visibilitychange', handleVisibilityChange);

    // 初始检查
    handleScroll();

    return () => {
      window.removeEventListener('scroll', handleScroll);
      window.removeEventListener('resize', handleScroll);
      document.removeEventListener('visibilitychange', handleVisibilityChange);
    };
  }, []);

  return (
    <DefaultFooter
      style={{
        background: 'none',
        position: position,
        left: position === 'fixed' ? '0' : 'auto',
        right: position === 'fixed' ? '0' : 'auto',
        bottom: position === 'fixed' ? '0' : 'auto',
        margin: '0 auto',
        maxWidth: '100%',
        width: '100%',
        textAlign: 'center', // 使文本居中
      }}
      copyright={`${currentYear} ${defaultMessage}`}
    />
  );
};

export default Footer;
